<!--
  Generated template for the FormShowPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>formShow</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <ion-title>{{title}}</ion-title>
  <p>{{comment}}</p>
      <div *ngFor="let row of rows" class="row">
          <div class="innerTable" *ngFor="let table of rows.tables">
              <div class="row" *ngFor="let innerRow of table.rows">
                <div class="col" *ngFor="let col of innerRow">
                    <div [ngSwitch]="col.controlType">
                        <div [ngSwitch]="col.controlType">
                          <div *ngSwitchCase="'input'">
                            <label class="item item-input">
                                <span class="input-label">{{col.label}}：</span>
                                <input type="text"  [(ngModel)]="col.value">
                            </label>
                          </div>

                        </div>
                    </div>
                </div>
              </div>
          </div>

          <div class="col" *ngFor="let col of row.cols">
            <div [ngSwitch]="col.controlType">
                <div [ngSwitch]="col.controlType">
                  <div *ngSwitchCase="'input'" class="item item-input">
                    <span class="input-label">{{col.label}}：</span>
                    <ion-input type="text" [(ngModel)]="col.value" placeholder="{{col.comment}}"></ion-input>
                  </div>
                  <div *ngSwitchCase="'number'" class="item item-input">
                      <span class="input-label">{{col.label}}：</span>
                      <ion-input type="number" [(ngModel)]="col.value" placeholder="{{col.comment}}"></ion-input>
                  </div>
                  <div *ngSwitchCase="'datetime'" class="item item-input">
                        <span class="input-label">{{col.label}}：</span>
                        <ion-input type="date" [(ngModel)]="col.value" placeholder="{{col.comment}}"></ion-input>
                  </div>
                  <div *ngSwitchCase="'radio'" class="item item-radio">
                      <ion-list radio-group [(ngModel)]="col.value">
                        <ion-list-header>{{col.label}}：</ion-list-header>
                        <ion-item *ngFor="let dic of col.dataList">
                          <ion-label>{{dic.value}}</ion-label>
                          <ion-radio value="{{dic.id}}"></ion-radio>
                        </ion-item>
                      </ion-list>
                  </div>

                  <div *ngSwitchCase="'checkbox'" class="item item-checkbox">
                    
                      <ion-list>
                        <ion-list-header>{{col.label}}：</ion-list-header>
                        <ion-item *ngFor="let dic of col.dataList">
                            <ion-label>{{dic.value}}</ion-label>
                            <ion-checkbox color="dark" (ionChange)="getCheckBox($event.checked,dic.id,col)">{{dic.id}}</ion-checkbox>
                        </ion-item>
                          
                        
                      </ion-list>
                  </div>

                </div>
            </div>
        </div>
      </div>
      <div class="row">
        <div class="col">
          <button class="button button-md" (click)="onSubmit()">提交</button>
        </div>
      </div>
    
</ion-content>
